<!DOCTYPE HTML>
<style>

a { color: #ffffff; text-decoration: none; outline: 0; }
a:hover, a:focus { color: #ffffff; text-decoration: none; outline: 0;   }
.facebook {
	 background:#3c5a98;

    /* css3 */
    -moz-box-shadow:0 0 4px rgba(0,0,0,0.4);
    -webkit-box-shadow:0 0 4px rgba(0,0,0,0.4);
    box-shadow:0 0 4px rgba(0,0,0,0.4); /* standards version last */
   padding: 10px;
font-size: 20px;
}
.facebook-hyper {
    border-color:#3c5a98;
    text-transform:lowercase;
    text-indent:17px;
    letter-spacing:10px;
    font-weight:bold;
    font-size:32px;
    line-height:33px;
    color:#fff;
   padding:5px 5px;
}

.linkedin{
	background:#0c6596;

    /* css3 */
    -moz-box-shadow:0 0 4px rgba(0,0,0,0.4);
    -webkit-box-shadow:0 0 4px rgba(0,0,0,0.4);
    box-shadow:0 0 4px rgba(0,0,0,0.4); /* standards version last */
    /* NOTE: webkit gradient implementation is not as per spec */
    background:-webkit-gradient(linear, left top, left bottom, from(#5babcb), to(#0c6596));
    background:-moz-linear-gradient(top, #5babcb, #0c6596);
  	padding: 10px;
font-size: 20px;
}

.linkedin-hyper {
    width:30px;
    overflow:hidden;
    padding:5px 7px;
    border-color:#185c80;
    text-transform:lowercase;
    text-indent:-185px;
    font-size:32px;
    font-weight:bold;
    color:#fff;
    
}
.h2{
font-family: 'Droid Sans', sans-serif;
font-size: 25px;
font-weight: bold;
line-height: 30px;
}
</style>
<div style="background:#D5D5D5"><center>
	<br/><h2>Login with <h2><br/>
<!--
	<a href="socialauth?id=facebook"><img src="resources/img/fbk.png"/></a>
   <!-- <a href="socialauth?id=linkedin"><img src="resources/img/in.png"/></a>-->
	<!--<span class="facebook"><a href="socialauth?id=facebook"><span class="facebook-hyper">f</span>Login with Facebook</a></span>-->
	<br/>
	<span class="linkedin"><a href="socialauth?id=linkedin"><span class="linkedin-hyper">in</span>Login with Linkedin</a></span>
	<br/>
	<br/></center>
</div>